<!--身份选择 -->
<template>
  <view class="identityselection-box">
    <p class="title">您的身份是？</p>
    <view
      v-for="(item, index) in identitylist"
      :key="index"
      class="item-box"
      @click="routebtn(item)">
      <image
        :src="item.src"
        class="imgsrc" />
      <view class="item-right-box">
        <p>{{ item.identity }}</p>
        <p>{{ item.describe }}</p>
      </view>
    </view>
  </view>
</template>
<script>
import { imgUrl } from 'common/httpEnum'

export default {
  name: 'identityselection',
  data() {
    return {
      imgUrl,
      identitylist: [
        // {
        //   identity: '货主',
        //   describe: '发货/找车，就用物实物流',
        //   type: '4',
        //   src: `${imgUrl}identityselection/cargoowner.png`
        // },
        {
          identity: '司机',
          describe: '千万货源，分秒配货',
          type: '3',
          src: `${imgUrl}identityselection/driver.png`
        },
        {
          identity: '经纪人',
          describe: '在线卸货找货非常方便',
          type: '2',
          src: `${imgUrl}identityselection/carrier.png`
        }
      ]
    }
  },
  methods: {
    routebtn(val) {
      uni.navigateTo({
        url: `/pages/login/userregistration?type=${val.type}`
      })
    }
  }
}
</script>
<style lang="scss">
.identityselection-box {
  height: 100vh;
  background: #fff;
  padding: 40rpx 30rpx;
  .title {
    font-size: 48rpx;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #000000;
    line-height: 67rpx;
    margin-bottom: 40rpx;
  }
  .item-box {
    display: flex;
    align-items: flex-end;
    background: #f5f7fb;
    height: 180rpx;
    border-radius: 8rpx;
    margin-bottom: 32rpx;
    padding: 0 60rpx;
    cursor: pointer;
    &:hover {
      background: rgba(41, 121, 255, 0.2);
    }
    .imgsrc {
      width: 140rpx;
      height: 130rpx;
      margin-right: 114rpx;
      vertical-align: middle;
    }
    p:nth-child(1) {
      font-size: 36rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #000000;
      line-height: 50rpx;
      margin-bottom: 12rpx;
    }
    p:nth-child(2) {
      font-size: 24rpx;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #999999;
      line-height: 33rpx;
    }
    .item-right-box {
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
  }
}
</style>
